import React, { Component } from 'react';
import { List, Toast } from 'antd-mobile';
import { Image, ScrollView, StatusBar, Text, View } from 'react-native';
import styles from './style';

const Item = List.Item;
const Brief = Item.Brief;

export default class extends Component {
  static navigationOptions = {
    title: '我',
    headerBackTitle: null,
    headerTitleStyle: {
      color: '#fff',
    },
    headerStyle: {
      backgroundColor: '#ed4040'
    },
    tabBarLabel: '我',
    tabBarIcon: ({ tintColor }) => (
      <Image
        source={require('../../images/avatar.png')}
        style={[styles.icon, { tintColor: tintColor }]}
      />
    ),
  };

  render() {
    const { navigate } = this.props.navigation;
    return (
      <ScrollView style={styles.profile}>
        <StatusBar barStyle="light-content" />
          <View style={styles.header}>
            <Image source={require('../../images/santa-claus.png')} style={styles.avatar} />
            <Text style={styles.nickName}>游客，你好</Text>
          </View>
          <List style={{ marginTop: 10, marginBottom: 10 }}>
            {/*<Item arrow="horizontal"*/}
                  {/*onClick={() => {*/}
                    {/*Toast.info('暂未开放.', 3, f => f, false);*/}
                  {/*}}><Text style={styles.font}>我要爆料</Text></Item>*/}
            <Item arrow="horizontal" multipleLine onClick={() => navigate('Collection')}
            >
              <Text style={styles.font}>我的收藏</Text>
            </Item>
          </List>
          <List style={{ marginBottom: 10 }}>
            <Item arrow="horizontal" onClick={() => navigate('Advertising')}
            >
              <Text style={styles.font}>广告合作</Text>
            </Item>
             <Item arrow="horizontal" onClick={() => navigate('Feedback')}
             >
               <Text style={styles.font}>意见反馈</Text>
             </Item>
            <Item arrow="horizontal" onClick={() => navigate('System')}
            >
              <Text style={styles.font}>系统设置</Text>
            </Item>
          </List>
      </ScrollView>
    );
  }
}
